<!DOCTYPE html> 
<html><head>
            <meta name="viewport" content="width=device-width, initial-scale=1"> 
            <title>jQuery Mobile Web App</title>
            <link href="jquery-mobile/jquery.mobile-1.0a3.min.css" rel="stylesheet" type="text/css"/>
<script src="jquery-mobile/jquery-1.5.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0a3.min.js" type="text/javascript"></script>
            <!-- This reference to phonegap.js will allow for code hints as long as the current site has been configured as a mobile application. 
                 To configure the site as a mobile application, go to Site -> Mobile Applications -> Configure Application Framework... -->
<script src="/phonegap.js" type="text/javascript"></script>
            
            <!-- main css 
            <link href="Resize/style.css" rel="stylesheet" type="text/css">
            -->
            <!-- media queries css 
            <link href="Resize/media-queries.css" rel="stylesheet" type="text/css">
            -->
            
<style type="text/css"> 
                                
ul
{
list-style-type: none;
padding: 0px;
margin: 0px;
}



.imageLogin
{
position: absolute;
height: auto;
width: auto;

}


.dashboard
{
	margin:0;
	position: absolute;
	width: auto;
	max-width: 100%;
	padding: 0%;
}

body,td,th {
	font-size: 0.81em;
	list-style-type: none;
}


body 
{
margin:0;
padding:0;

background-image: url();
}
#footerimg {
	position: absolute;
	height: auto;
	width: auto;
	vertical-align:bottom;
	float: left;
	top: 100%;
}
a:link {
color: #333333;
}


#dashbord_content {
	width: 100%;
	height: 3%;
	opacity: 0.7;
	top: 58%;
	position: absolute;
	left: 5%;
}
ul {
    width:100%;
    list-style:none;
    padding: 0;
    margin: 0;
    white-space: nowrap;
}

/*ul li {
	display: inline;
	text-align: center;
	width:30%;
	padding-left: 10%;
}*/

#li_home
{
	padding-left: 10%;
	position: absolute;
	top: 110%;
	height: auto;
	width: auto;
}

#li_profile
{
	padding-left: 68%;
	position: absolute;
	top: 110%;
	height: auto;
	width: auto;
}

#li_map
{
	padding-left: 40%;
	top: 110%;
	position: absolute;
	padding-top: 0px;
	height: auto;
	width: auto;
}

#li_search
{
	padding-left: 10%;
	position: absolute;
	top: 1600%;
	height: auto;
	width: auto;
	left: 285px;
}

#li_request
{
	padding-left: 68%;
	position: absolute;
	top: 1600%;
	height: auto;
	width: auto;
	right: 380px;
}

#li_help
{
	padding-left: 40%;
	top: 1600%;
	position: absolute;
	padding-top: 0px;
	height: auto;
	width: auto;
	right: 255px;
}


img { max-width: 100%; }



</style> 
            
         
            
<meta charset="utf-8">
</head> 

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> 

<div id="pagewrap">


<!-- /page -------------------------------------------------------->


  <div data-role="page" id="page">
                                             
                        
                        <div data-role="navbar hidebox">

    <ul>
        <li><a href="a.html" class="ui-btn-active">One</a></li>
        <li><a href="a.html" class="ui-btn-active">Two</a></li>
        <li><a href="a.html" class="ui-btn-active">Three</a></li>
    </ul>
</div>

                        
                        <figure class="post-image"> 
                          
                         </figure>
                        
                        <a href="page2" data-role="button" data-icon="star">Login</a>
                        
                        </div>





<!-- /page2 -------------------------------------------------------->

<div data-role="page" id="page2" >

              <div data-role="header" data-theme="c" >
              <img  src="images/new dashbord header.jpg">
              </div>
              
              
             <figure class="dashboard"> 
             <img src="images/dashboard.jpg"/> 
             </figure>	    
    
                        

            <div id="dashbord_content">
            <ul>
                <li id="li_home">HOME   </li>
                <li id="li_map">MAP</li>
                <li id="li_profile">PROFILE</li>
                <li id="li_request">REQUEST</li>
                <li id="li_help">HELP</li>
                <li id="li_search">SEARCH</li>
               
            </ul>
            </div>


             
                     <div id="footerimg"> 
                      
                       <img  src="images/footer.jpg">
                     
                     
                     </div>>
             




              <div data-role="footer" data-theme="c" data-position="fixed">		
                             
                  <div data-role="navbar">
                  
                       <ul>
                        <li><a href="#page3">One</a></li>
                          <li><a href="#">Two</a></li>
                          <li><a href="#">Three</a></li>
                      </ul>
                  </div><!-- /navbar -->
              </div><!-- /footer -->



          
	


     
</div>




<!-- /page3 -------------------------------------------------------->

<div data-role="page" id="page3">

                      <div data-role="header" data-position="inline" data-theme="c">
                      <a href="index.html" data-icon="delete">Cancel</a>
                      <h1>Request</h1>
                      <a href="index.html" data-icon="check" data-theme="b">Save</a>
                     </div>

	        <div data-role="content">
            
            
                   <figure class="imageLogin"> 
                   <img src="images/login back.jpg" /> 
                   </figure>
    	
                    <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="c" data-filter="true">
					<li data-role="list-divider">Search a site for Request</li>
					<li><a href="docs/toolbars/index.html"></a>
                    
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Aberfoyle DBN</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>

					<li><a href="docs/toolbars/index.html"></a>
                    <img src="images/bullet.png">
				    <h3 class="ui-li-heading">Addaippaliam Dialog</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Alexandra Place Dialog</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Aberfoyle DBN</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Addaippaliam Dialog</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
					
					
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Alexandra Place Dialog</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Aberfoyle DBN</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Aberfoyle DBN</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Addaippaliam Dialog</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>
                    
					<li><a href="docs/toolbars/index.html"></a>
                    <img class="ui-li-thumb" src="images/bullet.png">
				    <h3 class="ui-li-heading">Alexandra Place Dialog</h3>
				    <p class="ui-li-desc">DBN </p>
                    </li>

					</ul>

         </div>
                  
                  
                   <div data-role="footer" data-theme="c" >		
                    <div data-role="navbar" >
                        <ul>
                            <li><a href="#">One</a>
                             <img class="ui-li-thumb" src="images/bullet.png">
                            
                            </li>
                            <li><a href="#">Two</a></li>
                            <li><a href="#">Three</a></li>
                            <li><a href="#">Three</a></li>
                            <li><a href="#">All Req</a></li>
                        </ul>
                    </div><!-- /navbar -->
                  </div><!-- /footer -->


</div>



<!-- /page4 -------------------------------------------------------->
      
  <div data-role="page" id="page4">
      
                        <div data-role="header">
                        <h1>Page Four</h1>
                        </div>
                        
                        <div data-role="content">	
                        Content		
                        </div>
                        
                        <div data-role="footer">
                        <h4>Page Footer</h4>
                        </div>
      </div>





</div>
<!-- /#pagewrap -->


</body>
</html>